<template>
  <el-dialog :visible.sync="visible" :title="title" custom-class="dialog_big">
    <div v-loading="loading">
      <ex_super_desc v-bind="baseOption" :data="form" :attrs="$dialogDetailDescAttrs" />
      <ex_super_table v-bind="tableOption" :data="form.compartmentList" size="default" />
    </div>
  </el-dialog>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      visible: false, loading: false,
      title: "",
      form: {},
      baseOption: {
        model: [
          { key: 'code', label: 'label_container_code' },
          { key: 'status', label: 'label_status', formatter: (r, c, v) => this.$enumShow(v, "BaseContainerStatusEnum") },
          { key: 'containerTypeCode', label: 'label_container_type_code', },
          { key: 'warehouseCode', label: 'label_warehouse_code', },
          { key: 'areaCode', label: 'label_warehouse_area_code' },
          { key: 'locationCode', label: 'label_warehouse_location_code' },
          { key: 'compartmentNum', label: 'label_grid_mouth_count', },
          { key: 'containerRow', label: 'label_container_Layout_row_count', },
          { key: 'containerColumn', label: 'label_container_Layout_col_count', },
          { key: 'creator', label: 'label_create_user', },
          { key: 'gmtCreate', label: 'label_create_time', formatter: (r, c, v, i) => this.$dateFormat(v) },
        ],
      },
      tableOption: {
        model: [
          { key: 'code', label: 'label_grid_mouth_code', 'min-width': 140, 'show-overflow-tooltip': true, },
          { key: 'rowIndex', label: 'label_container_Layout_row', 'min-width': 120, 'show-overflow-tooltip': true, },
          { key: "columnIndex", label: "label_container_Layout_col", 'min-width': 120, 'show-overflow-tooltip': true, },
        ],
      }
    }
  },
  methods: {
    show({ title, params }) {
      this.loading = true
      this.visible = true
      this.title = title
      this.$ajax({
        url: '/wms-api/base/WmsBaseContainerRpc/detail.json',
        method: 'post',
        data: params,
        success: (res) => {
          this.form = Object.assign({}, res.data)
        },
        complete: () => {
          this.loading = false
        }
      })

    },


  }
}
</script>

<style scoped></style>
